<!DOCTYPE html>
<html>
<!--
	作者：litongjava@qq.com
	时间：2019-02-26
	描述：
	@see 01.jquery-ui.docx
-->

<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="jquery-ui-1.12.1/jquery-ui.min.css" />
<script src="jquery-ui-1.12.1/external/jquery/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery-ui-1.12.1/jquery-ui.min.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>
<div id="elem" />
</body>
<script type="text/javascript">
$("#elem").progressbar({
	value: 20
});
var value = $("#elem").progressbar("value");
console.log(value);
$("#elem").progressbar("option", {
	value: 30
});
var value = $("#elem").progressbar("option", "value");
console.log(value);
$("#elem").progressbar("option", {
	value: 100,
	disabled: true,
})
$("#elem").progressbar("enable");
//$("#elem").progressbar("disable");

//销毁小部件的各种方法
//$("#elem").progressbar("destroy");

//返回原始元素
var widget = $("#elem").progressbar("widget")
console.log(widget);

//绑定事件
$("#elem").bind("progresschange", function() {
	alert("值在改变");
});
</script>

</html>